@()(implicit request: RequestHeader, messages: Messages)
@main(messages("softCenter"))("allSoft", "") {

	<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/tableFilter.css")">

	<script src="@routes.Assets.at("bootstrap-table-master/dist/extensions/filter-control/my-bootstrap-table-filter-control.js")" type="text/javascript"></script>

	<style>
			.genome-pre {
				white-space: pre-wrap;
				word-wrap: break-word;
				border: 0px solid #ccc;
				background-color: white;
			}

			select:not([multiple]) {
				-webkit-appearance: none;
				-moz-appearance: none;
				background-position: right 50%;
				background-repeat: no-repeat;
				background-image: url();
				padding: .5em;
				padding-right: 1.5em
			}

			.fr {
				float: right;
			}

			.base-info .item .title span {
				display: inline-block;
				border-left: 2px solid #0b8af4;
				font-size: 14px;
				color: #333;
				padding-left: 10px;
			}

			.photo span {
				display: block;
				width: 92px;
				height: 92px;
			}

			.photo img {
				width: 100%;
				height: 100%;
			}

			tr > td {
				padding-top: 10px !important;
				padding-bottom: 10px !important;
			}

			.glyphicon-remove::before {
				content: "" !important;
			}

			.fglefttitle {
				font-size: 30px;
				font-weight: lighter;
				color: #A2A2A2;
			}

			.fc-button.fc-state-active, .portlet.calendar.light .fc-button.fc-state-hover {
				color: #333;
				border-bottom: 2px solid #36c6d3;
			}

			.fc-button {
				top: -60px;
				color: #666;
				text-transform: uppercase;
				font-size: 12px;
				padding-bottom: 15px;
			}

			.fc-button {
				-webkit-box-shadow: none;
				-moz-box-shadow: none;
				box-shadow: none;
				text-shadow: none;
				border: 0 #ddd;
				border-top-style: none;
				border-right-style: none;
				border-bottom-color: rgb(221, 221, 221);
				border-bottom-style: none;
				border-bottom-width: 0px;
				border-left-style: none;
				height: 35px;
				padding: 10px 8px 8px;
				padding-bottom: 8px;
				margin-left: 2px;
				background: 0 0;
				background-color: rgba(0, 0, 0, 0);
				top: -48px;
				outline: 0 !important;
				-webkit-border-radius: 4px 4px 0 0;
				-moz-border-radius: 4px 4px 0 0;
				-ms-border-radius: 4px 4px 0 0;
				-o-border-radius: 4px 4px 0 0;
				border-radius: 4px 4px 0 0;
				border-style: none solid;
				border-bottom-style: none;
			}

			.tooltip.left {
				margin-left: -10px !important;
			}

			.myHeart {
				cursor: pointer;
			}

			.mt-comment-info {
			}

	</style>
	<div class="page-content">

		<div class="row">
			<div class="col-md-12">
				<div id="form_wizard_1" class="portlet light profile-sidebar-portlet bordered">

					<div class="portlet-title">
						<div class="item">
							<div class="title clear">
								<span>@messages("softCenter")</span>
							</div>
						</div>
						<div class="caption">
						</div>
					</div>

					<div class="portlet-body form">

						<div class="fc-toolbar">

							<div class="row">

								<div class="col-sm-10">
									<div class="fc-button-group">
										<button type="button" class="fc-month-button fc-button fc-state-default">
											@messages("myCollection")</button>
										<button type="button" class="fc-month-button fc-button fc-state-default fc-state-active">
											@messages("allSofts")</button>
									</div>
								</div>

								<div class="col-sm-12" style="margin-bottom: 10px">

									<div class="col-sm-offset-10 col-sm-2" style="padding-right: 0px">
										<div class="col-sm-5" style="display: none">
											<select class="form-control mySort" name="sort" style="width: 100%">
												<option value="new" selected>@messages("theLatest")</option>
												<option value="host" >@messages("theHottest")</option>
											</select>
										</div>
										<div class="col-sm-12" style="padding-right: 0px">
											<div class="inputs" style="width: 100%">
												<div class="portlet-input input-inline input-small ">
													<div class="input-icon right">
														<i class="fa fa-search mySearch" style="cursor: pointer"></i>
														<input type="text" class="form-control form-control-solid input-circle mySearchInput" placeholder="@messages("search")..." name="keyword"> </div>
												</div>
											</div>
										</div>

									</div>

								</div>

								<div class="col-sm-12 mt-comments" id="soft">

								</div>


							</div>
						</div>


					</div>

				</div>
			</div>
		</div>
	</div>

	<script>

			var id = "@request.session.get("id")"

			$(function () {
				Tool.fileInput
				SoftCenter.init

			})
	</script>


}
